<template>
	<view class="content">
		<view class="list">
			<view class="item" @click="goDetail(item.repairId)" v-for="(item,index) in list.value">
				<view class="top">
					<text class="section">{{item.content}}</text>
					<text class="status" v-if="item.repairstatus==1">待处理</text>
					<text class="status" v-if="item.repairstatus==2">已派单</text>
					<text class="status" v-if="item.repairstatus==3">维修中</text>
					<text class="status" v-if="item.repairstatus==4">待验收</text>
					<text class="status" v-if="item.repairstatus==5">已完成</text>
					<text class="status" v-if="item.repairstatus==0">已取消</text>
				</view>
				<view class="center">
					报修位置：<text>{{item.region}} {{item.address}}</text>
				</view>
				<view class="center">
					故障类型：<text>{{item.repairtype}}</text>
				</view>
				<view class="center">
					预约时间：<text>{{item.ordertime}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import{ref,reactive} from 'vue'
	import{onLoad,onShow} from'@dcloudio/uni-app'
	import api from "@/api/api"
	let list=reactive([])
	let status=null
	onLoad((options)=>{
		status=options.status
	})
	onShow(()=>{
		api.getRepairList({
			repairstatus:status
		}).then(res=>{
			if(res.status=200){
				list.value=res.data
			}
		})
	})
	
	const goDetail=(id)=>{
		let url='/pages/admin/detail/detail?repairId='+id
		const identity=uni.getStorageSync('info').identity
		if(identity=='repairer'){
			url='/pages/repairer/detail?repairId='+id
		}
		uni.navigateTo({
			url
		})
	}
	
</script>

<style lang="scss">
.content{
	margin: 0 30rpx;
	.list {
		margin-top: 30rpx;
		.item {
			margin-bottom: 30rpx;
			background-color: white;
			padding: 20rpx;
			border-radius: 16rpx;
			box-shadow: 0rpx 4rpx 16rpx 0rpx rgba(131, 130, 130, 0.28);
	
			.top {
				display: flex;
				justify-content: space-between;
				padding-bottom: 10rpx;
				margin-bottom: 10rpx;
				border-bottom: 1rpx dashed #999999;
	
				.section {
					font-size: 32rpx;
					font-weight: bold;
				}
	
				.status {
					font-size: 32rpx;
					font-weight: bold;
					color: #F05C3E;
				}
			}
	
			.center {
				color: #666666;
				font-size: 26rpx;
				margin-bottom: 10rpx;
			}
	
		}
	}
}
</style>
